<template>
	<view class="activityDetail" v-if="activityInfo">

		<u-image :showLoading="true" id="topImage" :src="activityInfo.image_url" width="100%" height="auto"
			mode="widthFix"></u-image>
		<view class="activityName">
			<view class="name pNowrap">{{activityInfo.title}}</view>

			<view class="flex_center view1">
				<u-image src="@/static/images/hshijian.png" width="36rpx" height="36rpx" mode="scaleToFill"></u-image>
				<view class="detail dateTime">2022-11:00 【已报名2/10】</view>
			</view>

			<view class="flex_end_lr">
				<view class="flex_center view2">
					<u-image src="@/static/images/sqdingwei.png" width="36rpx" height="36rpx" mode="scaleToFill"></u-image>
					<view class="detail">{{activityInfo.address_area}}{{activityInfo.address_place}}</view>
				</view>
				<u-image src="@/static/images/sqdaohang.png" @click="mapClick" width="72.46rpx" height="72.46rpx"
					mode="scaleToFill"></u-image>
			</view>

		</view>

		<view class="activityName">
			<view class="name pNowrap">负责人</view>
			<view class="flex_center" v-if="activityInfo.manager">
				<scroll-view class="SV_group" scroll-x="true" show-scrollbar>
					<view class="SV_wrapper">
						<view class="SV_item" v-for="(item,index) in activityInfo.manager" :key="index"
							@click="toHomePage(item.id)">
							<u-avatar :src="item.avatar || ''" size="72"></u-avatar>
							<!-- <view class="nickname">{{item.nickname || item.realname}}</view> -->
							<view class="nickname">你来啊</view>
						</view>
					</view>
				</scroll-view>
			</view>

		</view>
		<!-- <view class="communityModule" v-if="activityInfo.users && activityInfo.users.length">
      
      <view class="master flex_center_lr" @click="applicantsListFn">
        <view class="lName">
          【已报名
          <text class="userNumber">
            {{activityInfo.users.length}}/{{activityInfo.numbers}}
          </text>
          】
        </view>
        <view class="flex_center">
          <u-image src="@/static/images/right.png" width="14.49rpx" height="25.36rpx" mode="scaleToFill"></u-image>
        </view>
      </view>
      <view class="avatars flex_center">
        <template v-if="activityInfo.users.length < 6">
          <view class="avatar" v-for="item in activityInfo.users" :key="item.id">
            <u-avatar :src="item.info && item.info.avatar" size="105rpx"></u-avatar>
          </view>
        </template>
        <u-avatar-group v-else :urls="userAvatar" gap="0.3" size="105rpx"></u-avatar-group>
      </view>
    </view> -->
		<view class="contentArea">



			<!-- 不要这个提示了  改成按钮上操作  -->
			<!--      <view class="newsInfo flex_center">
        <u-image src="@/static/images/BX/laba.png" width="36.23rpx" height="27.17rpx" mode="scaleToFill"></u-image>
        <view class="zhuyi">注意 : </view>
        <view class="info">
          该活动仅限社群成员报名
        </view>
      </view> -->

			<view class="topTabs">
				<u-tabs class="tab" :activeStyle="{
    		           color: '#252525',
    		           fontWeight: 'bold',
    		           fontSize: '33rpx',
    		           lineHeight: '45rpx'
    		       }" :inactiveStyle="{
    		         fontSize: '33rpx',
    		         marginTop:'10rpx',
    		         lineHeight: '45rpx',
    		         transform: 'scale(.9)',
    		           color: '#767676;',
    		       }" lineHeight="10rpx" lineColor="#FF5E01" lineWidth="100rpx" :list="tabs" :current="current"
					@change="tabsChange"></u-tabs>
			</view>


		</view>
		<view class="details">
			<view class="richContent" v-show="current == 0">
				<rich-text :nodes="richContent"></rich-text>
			</view>
		</view>

		<view class="fixedView">
			<view style="height: 20rpx;"></view>
			<view class="appointBtn" @click="toAppointment">预约</view>
		</view>

		<u-modal :show="show" :closeOnClickOverlay="true" title="报名信息" @close="close" @confirm="open">
			<view class="slot-content">
				<u--input placeholder="输入联系人" prefixIcon="server-man" border="bottom" v-model="moda_value"
					prefixIconStyle="font-size: 22px;color: #909399"></u--input>
			</view>
		</u-modal>
	</view>
</template>

<script>
	let codeTimer = null
	export default {
		data() {
			return {
				richContent: '',
				activityId: '',
				activityInfo: null,
				groupPageInfo: {},
				inputValue: {
					isFocus: false,
					isPhoto: false,
					avatar: '',
					form: {
						text: '',
						moment_id: '',
						p_id: ','
					}
				},
				showNotify: true,
				user: uni.getStorageSync('userInfo'),
				isFocus: false,
				myValue: '',
				userAvatar: [],
				tabs: [{
					name: '活动描述',
				}],
				current: 0,

				show: false,
				moda_value: uni.getStorageSync('userInfo').nickname,
				wechatDic: {},
				price: 0,
				photo: [],
				qrcodeUrl: ''
				// navbarF: false
			}
		},
		components: {

		},
		computed: {

		},


		onLoad(options) {
			this.activityId = options.id // 270

			this.activityInfo = {
				"id": 347,
				"user_id": 10230,
				"title": "功能室俱乐部（2）",
				"sort_id": 0,
				"acticity_s_time": "2025-02-15 15:00:00",
				"acticity_e_time": "2025-02-15 18:00:00",
				"application_s_time": "2025-02-05 00:00:00",
				"application_e_time": "2025-02-15 18:00:00",
				"numbers": 10,
				"status": 1,
				"address_area": "解放社区",
				"address_place": "2楼会议室",
				"longitude": "114.478262",
				"latitude": "38.041774",
				"image_url": "https://file.huaxinjiafu.com/uploadfile/20250109/735779074924064768.jpg",
				"is_together": 2,
				"is_entry": 1,
				"is_passport": 2,
				"is_free_experience": 2,
				"is_season": 2,
				"details": "<p><img src=\"https://file.huaxinjiafu.com/upload/17363250626904.jpg\" alt=\"\"></p>\n<p>石家庄飞扬少年演讲俱乐部</p>\n<p><br>飞扬少年演讲俱乐部：孩子的口才孵化地<br><br>你是否渴望孩子能自信表达，却苦恼缺少平台？飞扬少年演讲俱乐部，专为孩子搭建&ldquo;说话的舞台&rdquo;。<br><br>在这里，没有刻板教导，而是充满趣味与活力的交流空间。<br>就像一方肥沃土壤，鼓励孩子勇敢种下想法的种子，用声音灌溉，让其茁壮成长为动人的表达。<br><br>飞扬少年俱乐部提供各种语言作品供孩子日常练习，如小学语文课文，绕口令，中英文小故事，拜年词，评书，相声等，<br>同时精心打造各类场景模拟，从新闻发布会到童话角色辩论，为孩子提供无数开口机会。<br>让孩子在实践中克服恐惧，在互动中学会表达，从支支吾吾到侃侃而谈。<br><br></p>\n<p>别再等待，快来加入，让孩子的每一次发声都掷地有声！</p>\n<p><img src=\"https://file.huaxinjiafu.com/upload/17363257459312.jpg\" alt=\"\"></p>\n<p><br>来飞扬少年演讲俱乐部，给孩子4大关键成长助力：<br><br>1.&nbsp;塑造强大内心：孩子反复登台表演，在历练中强化心理素质，告别内向，养成开朗、大方、阳光性格，未来无惧挑战。<br><br>2.&nbsp;提升语文素养：中文即兴与备稿演讲，锻炼语言组织能力，让孩子爱上写作、善于写作，为语文学习筑牢根基。<br><br>3.&nbsp;增强英语能力：微信群日常英语练习，纠正发音，提升口语；英文备稿演讲，积累表达技巧，英语写作更出色。<br><br>4.&nbsp;培养综合能力：担任俱乐部官员或主持人，锻炼组织、社交能力，让孩子学会团队协作，拓展人脉。<br><br></p>\n<p>石家庄飞扬少年演讲俱乐部，真诚地邀请小朋友参加活动，让我们勇于表达，自信开口，展现少年风采&zwnj;&zwnj;！</p>\n<p><img src=\"https://file.huaxinjiafu.com/upload/17363257348063.jpg\" alt=\"\"></p>\n<p><br>参会对象：&nbsp;年满三周岁小朋友均可参与<br><br>活动环节：<br>1.&nbsp;快乐游戏<br>2.30秒自我介绍<br>3.即兴演讲<br>4.中（英）文主题演讲<br>5.点评及颁奖<br>6.自由表演<br><br><br>关于活动：<br>1.&nbsp;活动报名以小程序为准，本次活动限定20人，<br>请所有前来参加活动的朋友扫码进行活动报名；<br>2.为了活动体验的完整性，请于1月11日19:00前到场签到；<br>3.活动开始前24小时内取消预约，可退还会员次数（或报名费用）<br>4.&nbsp;在活动宣传中可能会使用到您的肖像，若您报名活动，<br>将默认您愿意授权使用包含您的肖像照片用于活动宣传</p>",
				"moment_img": null,
				"share_text": "你是否渴望孩子能自信表达，却苦恼缺少平台？\n飞扬少年演讲俱乐部，专为孩子搭建“说话的舞台”。",
				"owner_id": 10230,
				"owner_mobile": null,
				"activity_category": 0,
				"activity_type": 0,
				"activity_price": "124.00",
				"activity_cost": null,
				"member_price": "124.00",
				"is_notice": 0,
				"activity_label": "",
				"sign_url": "http://insurance-consult.oss-cn-beijing.aliyuncs.com/ass/6786458c64d54.jpeg",
				"group_id": 1116,
				"type_id": null,
				"created_at": "2025-01-14 19:07:55",
				"updated_at": "2025-02-14 15:29:45",
				"owner_ids": [{
					"id": 10232,
					"realname": "姚宁大号",
					"avatar": "https://insurance-consult.oss-cn-beijing.aliyuncs.com/avtar.png"
				}, {
					"id": 10227,
					"realname": "雷杰",
					"avatar": "https://file.huaxinjiafu.com/IMAGES/IMG1739159565dvrIP4gM"
				}],
				"is_special": 0,
				"h_desc": "活动结束",
				"h_status": 3,
				"b_desc": "报名截止",
				"b_status": 3,
				"group": {
					"id": 1116,
					"name": "吾室文化空间"
				},
				"nums": 2,
				"is_follow": 0,
				"users": [{
					"id": 3078,
					"user_id": 10219,
					"created_at": "2025-01-14 19:08:32",
					"info": {
						"nickname": "匿名用户",
						"avatar": "https://file.huaxinjiafu.com/uploadfile/20250114/737738316962897920.jpg"
					}
				}, {
					"id": 3079,
					"user_id": 10222,
					"created_at": "2025-01-14 19:25:53",
					"info": {
						"nickname": "匿名用户",
						"avatar": "https://file.huaxinjiafu.com/uploadfile/20250114/737792608096813056.jpg"
					}
				}],
				"season": {
					"id": 2,
					"name": "会员",
					"price": "99.00",
					"invite_count": 2,
					"use_date": 365,
					"count": 0,
					"status": 1,
					"create_at": null,
					"update_at": null,
					"have": null,
					"used": null,
					"pay_id": null
				},
				"free_type": 2,
				"is_free": 2,
				"acticity_s_time_c": 1739602800,
				"acticity_e_time_c": 1739602800,
				"application_s_time_c": 1738684800,
				"application_e_time_c": 1739613600,
				"comment_number": 1,
				"comment": [{
					"id": 162,
					"activity_id": 347,
					"user_id": 10172,
					"top_id": 0,
					"images": "",
					"text": "恶趣味去",
					"created_at": "2025-02-06 16:50:27",
					"user": {
						"nickname": "呆呆",
						"avatar": "https://file.huaxinjiafu.com/IMAGES/IMG1739180312afqx8axq"
					},
					"like": 0
				}],
				"open_vip": 2,
				"is_group_user": 0,
				"member_is_free": 2,
				"manager": [{
					"nickname": "匿名用户",
					"avatar": "https://insurance-consult.oss-cn-beijing.aliyuncs.com/avtar.png",
					"id": 10230
				}, {
					"id": 10232,
					"realname": "姚宁大号",
					"avatar": "https://insurance-consult.oss-cn-beijing.aliyuncs.com/avtar.png"
				}, {
					"id": 10227,
					"realname": "雷杰",
					"avatar": "https://file.huaxinjiafu.com/IMAGES/IMG1739159565dvrIP4gM"
				}],
				"is_enroll": 0
			}

			let richStr = this.activityInfo.details
			this.richContent = richStr.replace(/\<img/gi, '<img style="width:100%;height:auto" ') //正则替换
			
			return
			this.wechatQRCode()
		},
		onShow() {

		},
		mounted() {
			this.inputValue.avatar = this.user.avatar
		},
		methods: {
			
			toAppointment(){				
				console.log('预约')				
				uni.navigateTo({
					url: '/pages/function/appoint'
				})
			},
			
			wechatQRCode() {
				let _this = this
				let userInfo = uni.getStorageSync('userInfo')
				let params = {
					scene: `?aid=${this.activityId}&inviteId=${userInfo.id}`,
					page: 'pages/homePage/ActivityDetailsPage'
				}
				uni.request({
					url: this.$api.wechatQRCode, //获取图片的URL
					method: 'post',
					header: {
						Authorization: 'Bearer ' + uni.getStorageSync('token')
					},
					data: params,
					responseType: 'arraybuffer', //ArrayBuffer涉及面比较广，我的理解是ArrayBuffer代表内存之中的一段二进制数据，一旦生成不能再改。可以通过视图（TypedArray和DataView）进行操作。
					success(res) {
						let url = 'data:image/png;base64,' + uni.arrayBufferToBase64(res.data)
						_this.qrcodeUrl = url
					},
					fail(res) {

					}
				})
			},
			showPoster() {
				console.log('showPoster')
				this.$refs.posterRef.shareDataFn(this.activityInfo, this.qrcodeUrl)
				this.$refs.posterRef.open()
			},
			toHomePage(id) {
				let userInfo = uni.getStorageSync('userInfo')
				if (userInfo.id == id) {
					console.log('是自己不用跳转了')
					return
				}
				uni.navigateTo({
					url: `/BX/dynamic/othersPage?id=${id}`
				})
			},

			shareClick() {
				console.log('分享')
				let userInfo = uni.getStorageSync('userInfo')
				let shareData = {
					imageUrl: this.activityInfo.image_url,
					title: this.activityInfo.title,
					path: `/pages/homePage/ActivityDetailsPage?activityId=${this.activityId}&inviteId=${userInfo.id}`,
				}
				this.$refs.shareRef.shareDataFn(shareData)
				this.$refs.shareRef.open()
			},
			tabsChange(obj) {
				console.log(obj)
				this.$set(this, 'current', obj.index)
			},
			groupApply(HW) {
				let params = {
					id: this.activityId
				}
				this.$http.get(this.$api.activityDetail, params, HW).then(res => {
					if (res.code == 200) {
						if (res.data.manager && (res.data.owner_ids && res.data.owner_ids.length > 0)) {
							res.data.manager = [{
								...res.data.manager,
								id: res.data.user_id
							}, ...res.data.owner_ids]
						} else {
							res.data.manager = [{
								...res.data.manager,
								id: res.data.user_id
							}]
						}
						console.log(res.data, 'asdsadsadsada')
						this.activityInfo = res.data
						this.activityInfo.member_price_Fn = this.formatNumber(res.data.member_price)

						this.activityInfo.activity_price_Fn = this.formatNumber(res.data.activity_price)

						if (res.data.users && res.data.users.length) {
							this.userAvatar = res.data.users.map((item) => {
								return item.info && item.info.avatar || ''
							})

						}


						if (this.activityInfo.group_id && !this.groupPageInfo.id) {
							this.groupDetailFn()
						}
					} else {
						uni.showToast({
							title: res.message,
							icon: 'none'
						})
					}

				}).catch(err => {
					console.log(err)
				})
			},
			groupDetailFn() {
				let param = {
					page: 0,
					pageSize: 0,
					group_id: this.activityInfo.group_id
				}
				this.$http.get(this.$api.groupDetail, param, true).then(res => {
					if (res.code == 200) {
						this.groupPageInfo = res.data

					} else {
						uni.showToast({
							title: res.message,
							icon: 'none'
						})
					}
				}).catch(err => {
					console.log(err)
					this.loadingShow = false
				})
			},
			/* 发表评论 */
			confirm(text) {
				let param = {
					activity_id: this.activityInfo.id,
					text: text,
					images: this.photo.length ? this.photo[0].url : ''
				}
				this.$http.post(this.$api.activityCommentsAdd, param, true).then(res => {
					if (res.code == 200) {
						this.$set(this, 'myValue', '')
						this.$set(this, 'photo', [])
						this.$set(this, 'isFocus', false)
						this.groupApply(false)
					}
				}).catch(err => {
					console.log(err)
				})
			},
			blur() {

			},

			timeFn() {
				if (this.activityInfo.acticity_s_time && this.activityInfo.acticity_e_time) {
					return this.$util.timeSpecialFormFn(this.activityInfo.acticity_s_time, this.activityInfo.acticity_e_time)
				} else {
					return ''
				}

			},
			residualNumFn() {
				if (this.activityInfo.users && this.activityInfo.users.length) {
					return parseInt(this.activityInfo.numbers - this.groupPageInfo.users.length)
				} else {
					return parseInt(this.activityInfo.numbers)
				}
			},
			// 取消报名
			enrollCancel() {
				let params = {
					id: this.activityInfo.id,
				}
				this.$http.post(this.$api.activityeCancel, params, true).then(res => {
					if (res.code == 200) {
						uni.showToast({
							title: res.message,
							icon: 'none'
						})
						this.groupApply(false)
					} else {
						uni.showToast({
							title: res.message,
							icon: 'none'
						})
					}
				})
			},
			vipTimes(seasonDic) {
				if (seasonDic) {
					let have = parseInt(seasonDic.have)
					let used = parseInt(seasonDic.used)

					let numbers = have - used
					if (numbers >= 100) {
						return `不限次`
					} else {
						return `剩余${numbers}次`
					}
				}
				return ``
			},
			formatNumber(strNum) {
				const num = parseFloat(strNum);
				console.info(num)

				return Number.isInteger(num) ? num : num.toFixed(2);
			},
			appShowModel(price) {

				this.price = price
				// 首次不存在realPay 支付回调回来的金额，跳转支付弹窗的页面

				if (this.activityInfo.is_free == 1) {
					let params = {
						activity_id: this.activityInfo.id,
						realname: this.user.nickname,
						together: '1',
						type: 'app',
						openid: '',
						coin: 0,
						coupon_id: 0 //优惠券id
					}
					this.$http.post(this.$api.activityeEnroll, params, true).then(res => {
						if (res.code == 200) {
							this.groupApply(true)

						} else {
							uni.showToast({
								title: res.message,
								icon: 'none'
							})
						}
					})
				} else {
					let params = {
						price: this.price,
						type: 'activity',
						iSVip: !!this.activityInfo.is_group_user,
						vipPrice: this.activityInfo.member_price, // 会员价
						normalPrice: this.activityInfo.activity_price, // 原价
						discount_price: 0,
						title: this.activityInfo.title
					}

					this.$refs.payRef.open(params)
				}

				// } else {
				//   uni.showToast({
				//     title: "实名后在加入活动！",
				//     icon: 'none'
				//   })
				// }
			},
			showVIP() {
				/* '点击了加入社群' 跳转社群详情 */
				uni.navigateTo({
					url: `/BX/group/groupDetail?id=${this.activityInfo.group_id}`
				})
			},
			applicantsListFn() {
				/* 报名列表 */
				uni.navigateTo({
					url: `/BX/home/activityVues/applicantsList?id=${this.activityInfo.id}`
				})
			},

			open(coin, realPay, couponId) {
				let params = {
					activity_id: this.activityInfo.id,
					realname: this.user.nickname,
					together: '1',
					type: 'app',
					openid: '',
					coin: coin ? coin : 0,
					coupon_id: couponId ? couponId : '' //优惠券id
				}
				let This = this
				this.$http.post(this.$api.activityeEnroll, params, true).then(res => {
					if (res.code == 200) {
						This.wechatDic = res.data.config
						console.log(realPay, 'dasdasdsa')
						if (parseFloat(realPay) > 0) {
							// #ifdef APP-PLUS
							This.wechatPay(This.wechatDic)
							// #endif	
						} else {
							This.groupApply(true)
						}
					} else {
						uni.showToast({
							title: res.message,
							icon: 'none'
						})
					}
				})
			},
			close() {
				this.show = false
				// console.log('close');
			},
			toWechatPay(item, score, realPay, couponId) {
				console.log('点击了支付')


				this.open(score, realPay, couponId)


			},

			wechatPay(dataDic) {
				let _this = this
				let orderInfo = {
					"appid": dataDic.appid, // 微信开放平台 - 应用 - AppId，注意和微信小程序、公众号 AppId 可能不一致
					"noncestr": dataDic.noncestr, // 随机字符串
					"package": dataDic.package, // 固定值
					"partnerid": dataDic.partnerid.toString(), // 微信支付商户号
					"prepayid": dataDic.prepayid, // 统一下单订单号
					"timestamp": dataDic.timestamp.toString(), // 时间戳（单位：秒）
					"sign": dataDic.sign // 签名，这里用的 MD5/RSA 签名
				}
				uni.requestPayment({
					"provider": "wxpay",
					"orderInfo": orderInfo,
					success: function(res) {
						console.log('success:' + JSON.stringify(res));
						_this.groupApply(true)
					},
					fail: function(err) {
						console.log('fail:' + JSON.stringify(err));
						// uni.showModal({
						// 	content: JSON.stringify(err)
						// })
						_this.$refs.payRef.close()
					}
				})
			},
			mapClick() {
				uni.openLocation({
					latitude: Number(this.activityInfo.latitude),
					longitude: Number(this.activityInfo.longitude),
					name: this.activityInfo.title,
					address: this.activityInfo.address_area,
					success: function() {
						console.log('success');
					}
				});
			},

			// 删除图片
			deletePic(event) {
				this.photo = []
			},
			// 新增图片
			async afterRead(event) {
				// 当设置 multiple 为 true 时, file 为数组格式，否则为对象格式

				console.info(event)
				this.photo = []
				let lists = event.file
				this.photo.push({
					...lists,
					status: 'uploading',
					message: '上传中'
				})
				const result = await this.uploadFilePromise(lists.url)
				this.photo.splice(0, 1, Object.assign(this.photo[0], {
					status: 'success',
					message: '',
					url: result
				}))

			},
			uploadFilePromise(url) {
				let This = this
				return new Promise((resolve, reject) => {
					this.$util.uploadOSS({
						path: url
					}).then((res) => {
						setTimeout(() => {
							This.$set(This, 'isFocus', true)
							resolve(res)
						}, 500)
					}).catch(err => {
						console.log(err)
					})
				})
			},
		}
	}
</script>

<style scoped lang="scss">
	.flex_center_lr {
		display: flex;
		align-items: center;
		justify-content: space-between;
	}

	.flex_end_lr {
		display: flex;
		align-items: self-end;
		justify-content: space-between;
	}

	.flex_center_center {
		display: flex;
		align-items: center;
		justify-content: center;
	}

	.flex_center_around {
		display: flex;
		align-items: center;
		justify-content: space-around;
	}

	.flex_center {
		display: flex;
		align-items: center;
	}

	.topTitle {
		font-weight: 500;
		font-size: 33rpx;
		color: #252525;
		line-height: 45rpx;
		margin-left: 20rpx;
	}

	.pNowrap {
		overflow: hidden;
		text-overflow: ellipsis;
		white-space: nowrap;
	}

	.topTabs {
		margin-top: 36rpx;
		margin-bottom: 28rpx;
		height: 75rpx !important;

		/deep/ .u-tabs__wrapper__nav {
			height: 75rpx;
		}

		/deep/ .u-tabs__wrapper__nav__item {
			padding: 0 !important;
			height: 50rpx !important;
		}

		/deep/ .u-tabs__wrapper__nav__item-1 {
			padding: 0 40rpx !important;
		}
	}

	.activityName {
		width: 100%;
		background: #fff;
		padding: 36rpx;
		margin-top: 18rpx;
		box-sizing: border-box;

		.name {
			font-size: 33rpx;
			color: #252525;
			line-height: 45rpx;
			font-weight: bold;
			margin-bottom: 39rpx;
		}

		.nickname {
			font-weight: 400;
			font-size: 29rpx;
			color: #252525;
			line-height: 40rpx;
			margin-left: 18rpx;
		}

		.view1 {
			margin-bottom: 7rpx;

			.dateTime {
				overflow: auto;
				white-space: nowrap;
			}
		}

		.view2 {
			margin-bottom: 3.6rpx;
		}

		.detail {
			font-weight: 400;
			font-size: 29rpx;
			color: #252525;
			line-height: 40rpx;
			margin-left: 20rpx;
		}
	}

	.activityDetail {
		background-color: #F5F6F7;
		padding-bottom: 150rpx;

		.contentArea {
			width: 100%;
			padding: 0 36rpx 18rpx;
			box-sizing: border-box;
		}


		.communityModule {
			background: #FFFFFF;
			border-radius: 14rpx;
			padding: 36rpx;
			margin-bottom: 18rpx;
			margin-top: 18rpx;

			.master {
				margin-bottom: 36rpx;

				.lName {
					font-weight: 600;
					font-size: 29rpx;
					color: #252525;
					line-height: 40rpx;
				}

				.userNumber {
					color: #FF5E01;
				}

				.rName {
					font-weight: 400;
					font-size: 26rpx;
					color: #027AFF;
					line-height: 36rpx;
					margin-right: 27rpx;
				}
			}

			.avatars {
				margin-bottom: 16rpx;

				.avatar {
					margin-left: 20rpx;
				}

				.avatar:first-child {
					margin-left: 0;
				}

				.name {
					font-weight: 400;
					font-size: 24rpx;
					color: #727272;
					line-height: 31rpx;
					text-align: center;
					margin-top: 18rpx;
				}
			}
		}

		.newsInfo {
			background: #FFCB00;
			border-radius: 14rpx;
			padding: 18rpx 36rpx;
			margin-bottom: 18rpx;

			.zhuyi {
				font-weight: 500;
				font-size: 26rpx;
				color: #252525;
				line-height: 36rpx;
				margin: 0 10rpx;
			}

			.info {
				font-weight: 400;
				font-size: 29rpx;
				color: #252525;
				line-height: 40rpx;
			}
		}

		.details {
			background: #FFFFFF;
			border-radius: 14rpx;
			padding: 36rpx;
			// margin-bottom: 150rpx;

			.name {
				font-weight: 600;
				font-size: 33rpx;
				color: #252525;
				line-height: 45rpx;
				margin-bottom: 36rpx;
			}

			.richContent {

				p {
					font-weight: 400;
					font-size: 32rpx;
					color: #252525;
					line-height: 52rpx;
					letter-spacing: 1.6px;
					margin-bottom: 14rpx;
				}

				img {
					display: block;
					width: 100%;
					background: green;
					max-width: 100%;
				}
			}
		}



		.created_at {
			font-size: 26rpx;
			color: #afb2b9;
			line-height: 30rpx;
			padding-bottom: 20rpx;
			border-bottom: 1px solid #eeeeee
		}

		.discussDiv {
			margin: 30rpx auto 50rpx;

			.pinglunNum {
				font-size: 34rpx;
				line-height: 34rpx;
				color: #6d707b;

			}
		}

		.buttonBM {
			width: 100%;
			background-color: white;
			padding: 36rpx;
			box-sizing: border-box;
			position: fixed;
			bottom: 0%;
			left: 0;
			right: 0;

			.buttonL {
				width: 260rpx;
				height: 90rpx;
				margin: 0;
				background-color: #673AB7;
				transform: skew(-12deg);
				border-radius: 16rpx;
				background: linear-gradient(120deg, #E2EDF6 0%, #F7F8E4 100%);

				border: 0;

				font-weight: bold;
				font-size: 33rpx;
				color: #3D3D3D;
				line-height: 45rpx;
			}

			.buttonR {
				display: flex;
				align-items: center;
				justify-content: center;
				width: 260rpx;
				height: 90rpx;
				margin: 0;
				background-color: #673AB7;
				transform: skew(-12deg);
				border-radius: 16rpx;
				background: #292F45;
				border: 0;

				font-weight: 600;
				font-size: 40rpx;
				color: #DCCE81;
				line-height: 54rpx;
				margin-left: 10px;

				.pay-text-tr {
					font-weight: 400;
					font-size: 24rpx;
					line-height: 26rpx;
				}
			}
		}

		.myRemark {
			margin: 0 0 44rpx;
		}

		.myInput {
			border: 0;
			margin-left: 36rpx;
			background: #f5f5f5;
			border-radius: 14rpx;

			/deep/ .u-upload__wrap__preview {
				margin: 0 !important;
			}
		}

		.class_button {
			background-color: #f7f7f7;
			color: rgba(0, 0, 0, .3);
			border: 1rpx solid rgba(0, 0, 0, .2);
			width: 100% !important;
		}

		.huaxian {
			font-size: 30rpx;
			display: inline-block;
			min-width: 100rpx;
			min-width: 80rpx !important;
			padding: 0rpx 10rpx;
		}

		.underline {
			text-decoration: line-through;
		}
	}

	.SV_group {
		// width: calc(100% - 60rpx);

		.SV_wrapper {
			display: flex;
		}

		.SV_item {
			display: flex;
			flex-shrink: 0;
			width: 150rpx;
			color: #333;
			margin-right: 10rpx;
			flex-direction: column;
			align-items: center;
			justify-items: centerl
		}
	}
	.fixedView{
		position: fixed;
		left: 0rpx;
		right: 0rpx;
		bottom: 0rpx;
		height: calc(env(safe-area-inset-bottom) + 120rpx);		
		background: white;
		.appointBtn{
			width: 80%;
			margin:  auto;
			background-color: #292F45;
			transform: skew(-12deg);
			color: #DCCE81;
			height: 80rpx;
			line-height: 80rpx;
			border-radius: 10rpx;
			text-align: center;
			font-size: 36rpx;
			letter-spacing: 10rpx;
		}
	}
	
</style>